<style lang="less">
   #permission .liOrganizationTreeItem {
   		padding: 7px 30px;
   		background-color: #f7f7f7;
   		margin-bottom: 10px;
   }
   #permission .liOrganizationTreeItem:hover {
   		background-color: #dddee1;
   }
   #permission .industryAction{
   		display: inline-block;
   		width: 20px;
   		height: 20px;
   		border: 1px solid #dedde2;
   		text-align: center;
   		line-height: 20px;
   }
   #permission .industryAction  .ivu-icon-help-circled{
    	left: 10px!important;
   }
   #permission .permissionTree .selected {
   		background-color: #dddee1;
   		color: #2d8cf0;
   }
   
</style>
<template>
    <li class="permissionTree">
    	<div :class="{ selected: permission_id == model.id}" class="liOrganizationTreeItem" @click="permissionInfo(model)">
		    <span @click="showChild = !showChild" v-if="model.children" style="cursor: pointer">
				<Icon v-if="showChild" type="android-arrow-dropdown" style="font-size: 20px;"></Icon>
	    		<Icon v-if="!showChild" type="android-arrow-dropright" style="font-size: 20px;"></Icon>
	    		<Icon type="ios-folder-outline"></Icon>
	    	</span>
	    	<span  v-if="!model.children">
	    		<Icon type="ios-paper-outline"></Icon>
	    	</span>
		    <span style="cursor:pointer;margin-left:3px;" >
		      	{{model.title}}
		      	<span style="float: right;" >
		      		<span @click="addPermission(model, flag)" class="industryAction" ><Icon type="plus"></Icon></span>
			      	<span @click="editPermission(model, flag)" class="industryAction"><Icon type="edit"></Icon></span>
			    	<Poptip
				        confirm
				        title="您确认删除这条内容吗？"
				        @on-ok="ok(model)"
				        @on-cancel="cancel" class="industryAction">
				        <Icon  type="close"></Icon>
				    </Poptip>
		      	</span>
		    </span>
    	</div>
	    <!--二级菜单-->
        <ul v-for="(item , index) in model.children" v-show="showChild" class="tree" style="padding-left: 20px; " >
    		<permission-tree :model="item" :permission_id="permission_id" :flag="'secondMenu'" :key="index"></permission-tree>
    	</ul>
    </li>
</template>

<script>
export default {
	name: 'permission-tree',
	props: ["model", "permission_id", "flag"],
	data () {
	    return {
	    	showChild: false,
	    };
	},
	created(){
		
	},
	mounted() {
		
	},
	methods: {
		ok (model) {
			if(model.children == null){
				this.$axios.post(
		        	'/api/Permission/delPermission.do',
		        	{id: model.id} 
		        ).then(res => {
		        	this.$Notice.success({title: '删除成功！'});
					this.bus.$emit("getPermissionList");
		        });
			}else {
				this.$Notice.warning({title: '请先删除子机构！'});
			}
        },
        cancel () {
            //this.$Message.info('点击了取消');
        },
	    permissionInfo(model){
	    	this.bus.$emit('permission_id', model.id);
	    	this.bus.$emit('permissionInfo', model);
	    },
	    addPermission(model, flag){
	    	if(flag == "firstMenu"){
	    		flag = "secondMenu";
	    	}else if(flag = "secondMenu"){
	    		flag = "fun";
	    	}
    		this.bus.$emit('addPermission', model, flag);
	    },
	    editPermission(model, flag){
	    	if(flag == "secondMenu"){
	    		if(model.path == null) {
	    			flag = "fun";
	    		}
	    	}
    		this.bus.$emit('editPermission', model, flag);
	    }
    }
}
</script>
